<template>
    <div id="app">
      <ul class="list">
        <li class="item">
          <img src="../assets/logo.png" alt="">
        </li>
        <li>
          <img src="../assets/logo.png" alt="">
        </li>
        <li>
          <img src="../assets/logo.png" alt="">
        </li>
        <li>
          <img src="../assets/logo.png" alt="">
        </li>
        <li>
          <img src="../assets/logo.png" alt="">
        </li>
      </ul>
    </div>
</template>
<script>
export default {
components: {},
data() {
  return {

  }
},
methods:{

}

}

</script>
<style lang="scss" scoped>
#app{
  width: 700px;
  height: 700px;
  border: 1px solid #ccc;
}
ul{
  list-style: none;
  margin: 0;
  padding: 0;
}
.list{
  display:flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.list::after{
  content:'';   
  width: 200px;
  height: 200px;
}
.item{
  width: 200px;
  height: 200px;
}
</style>
